<template>
    <div class="footprint">
        <div class="title clearfix">
            <ul>
                <li>订单信息</li>
                <li>价格</li>
            </ul>
        </div>
        <div class="content-list clearfix">
            <p><span>8.31</span> 今天</p>
            <ul class="clearfix">
                <li>
                    <div class="user clearfix">
                        <img src="../../../assets/meirong1.jpg" alt="">
                        <div class="user-text">
                            <p>注射微整</p>
                            <p>北京微美医疗美容诊所</p>
                        </div>
                    </div>
                </li>
                <li>￥399<span>￥399</span></li>
            </ul>
            <p><span>8.31</span> 今天</p>
            <ul class="clearfix">
                <li>
                    <div class="user clearfix">
                        <img src="../../../assets/meirong1.jpg" alt="">
                        <div class="user-text">
                            <p>注射微整</p>
                            <p>北京微美医疗美容诊所</p>
                        </div>
                    </div>
                </li>
                <li>￥399<span>￥399</span></li>
            </ul>
        </div>
    </div>
</template>

<script>
    export default {
        name: "Footprint"
    }
</script>

<style scoped lang="less">
    @import "../../../style/style";
  .footprint{
      border: solid 1px #e0e0e0;
      .title{
          background-color: #f5f5f5;
          ul{
              li{
                  float: left;
                  width: 50%;
                  text-align: center;
                  color: #666666;
                  font-size: 12px;
                  padding: 15px 0;
              }
          }
      }
      .content-list{
          padding: 17px;
          >P{
              color: #666666;
              span{
                  color: black;
                  font-size: 20px;
              }
          }
          ul{
              border: solid 1px #e0e0e0;
              padding: 17px;
              margin-bottom: 30px;
              >:last-child{
                  text-align: center;
                  padding-left: 10px;
                  color: @theme-color-dark;
                  font-size: 20px;
                  padding-top: 23px;
                  span{
                      color: #999999;
                      font-size: 14px;
                      text-decoration:line-through;
                  }
              }
              li{
                  float: left;
                  width: 50%;
                  img{
                      width: 80px;
                      height: 80px;
                      float: left;
                  }
                  .user-text{
                      margin-left: 20px;
                      float: left;
                      >:first-child{
                          color: #333333;
                          font-size: 14px;
                          padding-top: 20px;
                          padding-bottom: 5px;
                      }
                      p{
                          color: #999999;
                      }
                  }
              }
          }
      }
  }
</style>